<template>
	<view class="content">
		<view class="content_time">
			{{itemJob.datetime}}
		</view>
		<view class="content_item" @click="handleLink">
			<view class="content_item_tp u-border-bottom" v-if="itemJob.message">
				<view class="u-flex u-row-between">
					<view class="u-font-36 u-font-weight">
						{{itemJob.message.jobname}}
					</view>
					<view class="u-font-32" style="color: #ff5017;">
						{{itemJob.message.wage_text}}
					</view>
				</view>
				<view class="u-flex u-flex-wrap u-m-t-20">
					<view class="content_item_tp_tag">
						{{itemJob.message.education_text}}
					</view>
					<view class="content_item_tp_tag">
						{{itemJob.message.experience_text}}
					</view>
					<view class="content_item_tp_tag">
						{{itemJob.message.district_text}}
					</view>
				</view>
			</view>
			<view class="content_item_btm">{{$u.timeFormat(itemJob.addtime, 'yyyy-mm-dd hh:MM')}}
				由{{itemJob.self_side==1?'你':'对方'}}发起的沟通
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		ref,
		watch
	} from 'vue'
	const itemJob = ref({})
	const props = defineProps({
		itemJob: Object
	})
	watch(()=>props.itemJob,(nv)=>{
		itemJob.value = nv
	},{
		immediate:true,
		deep:true
	})
	const handleLink = () => {
		uni.$u.route('pages/pagesHome/detailPages/job', {
			id: itemJob.value.message.jobid
		})
	}
</script>

<style lang="scss" scoped>
	.content {
		margin-bottom: 60rpx;
		color: #101010;

		&_time {
			text-align: center;
			margin: 46rpx 0 28rpx 0;
			color: #999999;
			font-size: 24rpx;
		}

		&_item {
			background-color: #fff;
			width: 90vw;
			margin: 0 auto;
			border-radius: 10rpx;
			font-size: 28rpx;
			padding: 0 30rpx;

			&_tp {
				padding: 36rpx 0;

				&_tag {
					color: #666666;
					font-size: 26rpx;
					margin-right: 12rpx;
					background: #F8F8F8;
					padding: 8rpx 16rpx;
					border-radius: 10rpx;
				}
			}

			&_btm {
				padding: 32rpx 0 24rpx;
				color: #999999;
				font-size: 24rpx;
			}
		}

	}
</style>